<!--
 * @Description: 轮播图
 * @Author: zhaoxiaoyang
 * @LastEditors: seadon
 * @Date: 2021-07-21 19:03:23
 * @LastEditTime: 2022-09-22 16:01:57
-->
<template>
	<div class="carousel">
		<a-carousel :dots="false" arrows autoplay>
			<template #prevArrow>
				<div class="slick-arrow-left">
					<i class="low-code iconleft"></i>
				</div>
			</template>
			<template #nextArrow>
				<div class="slick-arrow-right">
					<i class="low-code iconxiangyou"></i>
				</div>
			</template>
			<div
				v-for="(item, index) in carouselData"
				:key="index"
				class="carousel-box"
				@click="handleClickDetail(item)"
			>
				<img :src="item.picture_url" />
				<div class="carousel-text">
					{{ item.title }}
				</div>
			</div>
		</a-carousel>
	</div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router'
import { client } from '@/utils'
import './index.less'

defineProps<{
	carouselData: any
}>()
const router = useRouter()
const emit = defineEmits(['onCarousel'])
const handleClickDetail = (item: Record<string, any>) => {
	if (item.type === 1) {
		client.openWindow(item.external_link)
		// window.open(item.external_link)
	} else {
		router.push({
			name: 'AttachmentDetail',
			query: {
				type: 'carousel',
				id: item.carousel_id,
			},
		})
	}
	emit('onCarousel', item)
}
</script>
